<template>
  <div class="hello">
<!--    <Noticebar ref="noticechild"></Noticebar>-->
<!--    <van-notice-bar scrollable text="因数据交互影响，11点之前查询的是昨天的预警信息，想查询当天的预警请11点查询！平台服务热线：400-079-6667" />-->
    <van-grid :column-num="2">
      <van-grid-item  v-for="(item,index) in girdData"
                      :key="index"
                      :text="item.text"
                      :icon="item.icon"
                      :dot="item.dot"
                      :icon-color="item.color"
                      :clickable="item.dot"
                      @click="getclick(item)"
                      />
    </van-grid>
  </div>
</template>
<script>
  // 1. 引入你需要的组件
  import { Button,Grid, GridItem, List ,NoticeBar ,Dialog ,showDialog  } from 'vant';
  // 2. 引入组件样式
  import 'vant/lib/index.css';

  import axios from "axios";

export default {
  name: 'HelloWorld',
  props: {
    msg: String,
  },
  data(){
    return{
      girdData:[],
    }
  },

  components: {
    // Noticebar,
    [Button.name]: Button,
    [Grid.name]: Grid,
    [GridItem.name]: GridItem,
    [List.name]: List,
    [NoticeBar.name]: NoticeBar,
    [Dialog.name]: Dialog,
    [showDialog.name]: showDialog
  },
  mounted() {

  },
  methods: {
    getuserinfo(){
        console.log('+++++++++++++++++++',sessionStorage.getItem('prjid'))
      // const data={
      //   prjid:sessionStorage.getItem('prjid')
      // }
      // http://bs.bzjsgl.cn/admin/getdata/getPrjAlertsType?prjid=12
      axios.post('http://bs.bzjsgl.cn/admin/getdata/getPrjAlertsType',{prjid:sessionStorage.getItem('prjid')})
              .then(response => (
              console.log(response.data['data']),

              this.girdData = response.data['data']
              ))
              .catch(function (error) { // 请求失败处理
                console.log(error)
              })
    },
    getclick(item){
      //判断此组件是否可以点击
      if(item.dot == true){
        sessionStorage.setItem('alertext',item.text),
            console.log(sessionStorage.getItem('prjid'))
        this.$router.push('/about'+'?prjid=' + sessionStorage.getItem('prjid')+'&id='+item.id)
      }else {
        showDialog({
          message: '没有 '+item.text+' 信息',
          theme: 'round-button',
        }).then(() => {
        });
      }
    }
  }
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
  margin: 40px 0 0;
}
ul {
  list-style-type: none;
  padding: 0;
}
li {
  display: inline-block;
  margin: 0 10px;
}
a {
  color: #42b983;
}
.active-grid-item {
  /* 自定义点击时的样式 */
  background-color: #f5f5f5;
}

</style>
